<template>
  <div class="about">
    <h1>This is an about page</h1>
    <div>
      <virtual-list
        :size="40"
        :remain="8"
        :data-sources="items"
        :data-component="item"
        :data-key="'id'"
        style="height: 500px; overflow: auto"
      >
      </virtual-list>
    </div>
  </div>
</template>

<script>
import virtualList from "vue-virtual-scroll-list";
import item from "./item";
export default {
  data() {
    return {
      items: [],
      item: item,
    };
  },
  methods: {
    forss() {
      for (let i = 1; i <= 10000; i++) {
        this.items.push({
          id: i,
          name:
            i +
            "12123d5a45ad56addadjak放假啊就恢复健康发号放假安徽科技发货方就按客户",
        });
      }
    },
  },
  created() {
    this.forss();
  },
  components: { "virtual-list": virtualList, item },
};
</script>

<style scoped></style>